<template>
  <div id="app">
    <h1>EASY NOTES</h1>
    <div class="note-container">
      <n-sideBar></n-sideBar>
      <n-noteList></n-noteList>
      <n-editer></n-editer>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import sideBar from './components/sideBar/sidebar.vue'
  import noteList from './components/noteList/noteList.vue'
  import editer from './components/editer/edit.vue'
  export default {

    components: {
      'n-sideBar': sideBar,
      'n-noteList': noteList,
      'n-editer': editer
    }

  }
</script>
<style lang="scss" rel="stylesheet/scss">
  @import "assets/sass/mixin.scss";
  h1{
    text-align: center;
    color: #3d4957;
  }
  .note-container {
    width: 1000px;
    height: 800px;
    border: 1px solid #ccc;
    margin: 0 auto;
    padding: 1px;
    @include flexbox();
  }
</style>
